<!DOCTYPE HTML>
<html>
<head>
<script src="/js-test-resources/js-test.js"></script>
<script src="../resources/pointer-lock/pointer-lock-test-harness.js"></script>
</head>
<body>
<div>
  <div id="target1"></div>
  <iframe src="http://localhost:8080/resources/pointer-lock/inner-iframe.html" onload="doNextStepWithUserGesture()"></iframe>
</div>
<script>
    description("Test iframe from different origin can not access pointerLockElement.")
    window.jsTestIsAsync = true;

    targetDiv1 = document.getElementById("target1");
    iframe = document.getElementsByTagName("iframe")[0];

    todo = [
      function () {
          expectOnlyChangeEvent("Lock targetDiv1.");
          targetDiv1.requestPointerLock();
          // doNextStep called by event handler.
      },
      function () {
          shouldBe("document.pointerLockElement", "targetDiv1");
          doNextStep();
      },
      function () {
          iframe.contentWindow.postMessage(["eval", 'parent.postMessage(thisFileName() + " document.pointerLockElement = " + document.pointerLockElement, "*")'], "*");
          window.onmessage = function (messageEvent) {
              message = messageEvent.data;
              shouldBeEqualToString("message", "inner-iframe.html document.pointerLockElement = null");
              window.onmessage = null;
              doNextStep();
          }
      },
    ];
    // doNextStep() called by iframe onload handler.
</script>
</body>
</html>
